<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>个人博客模板（寻梦）</title>
<meta name="keywords" content="个人博客模板,博客模板" />
<meta name="description" content="寻梦主题的个人博客模板，优雅、稳重、大气,低调。" />
<link href="${ctxPath}/static/blog/caogen/css/base.css" rel="stylesheet">
<link href="${ctxPath}/static/blog/caogen/css/learn.css"
	rel="stylesheet">
<!--[if lt IE 9]>
<script src="${ctxPath}/static/blog/caogen/js/modernizr.js"></script>
<![endif]-->
</head>
<body>
	<header>
		<div id="logo">
			<a href="/"></a>
		</div>
		<nav class="topnav" id="topnav">
			 <a href="${ctxPath}/front/blog/indexc"><span>首页</span><span class="en">Protal</span></a><a
				href="${ctxPath}/front/blog/aboutc"><span>关于我</span><span class="en">About</span></a><a
				href="${ctxPath}/front/blog/newlist"><span>慢生活</span><span class="en">Life</span></a><a
				href="${ctxPath}/front/blog/moodlist"><span>碎言碎语</span><span class="en">Doing</span></a><a
				href="${ctxPath}/front/blog/share"><span>模板分享</span><span class="en">Share</span></a><a
				href="${ctxPath}/front/blog/knowledge"><span>学无止境</span><span class="en">Learn</span></a><a
				href="${ctxPath}/front/blog/book"><span>留言版</span><span class="en">Gustbook</span></a>
		</nav>
		</nav>
	</header>
	<article class="blogs">
		<h1 class="t_nav">
			<span>我们长路漫漫，只因学无止境。 </span><a href="/" class="n1">网站首页</a><a
				href="/" class="n2">学无止境</a>
		</h1>
		<div class="newblog left">
			<h2>仿新浪博客风格・梅――古典个人博客模板</h2>
			<p class="dateview">
				<span>发布时间：2013-11-04</span><span>作者：zsCat</span><span>分类：[<a
					href="/news/life/">个人博客模板</a>]
				</span>
			</p>
			<figure>
				<img src="images/01.jpg">
			</figure>
			<ul class="nlist">
				<p>界面设计非原创，出自新浪博客风格・梅作者水云心。在原来的设计上增加了梅花飘落的flash动画。原设计的边界阴影部分用图片实现，本例采用css3新的规则属性，box-shadow</p>
				<a title="/" href="/" target="_blank" class="readmore">详细信息>></a>
			</ul>
			<div class="line"></div>
			<h2>黑色质感时间轴html5个人博客模板</h2>
			<p class="dateview">
				<span>发布时间：2013-11-04</span><span>作者：zsCat</span><span>分类：[<a
					href="/news/life/">个人博客模板</a>]
				</span>
			</p>
			<figure>
				<img src="images/02.jpg">
			</figure>
			<ul class="nlist">
				<p>黑色时间轴html5个人博客模板颜色以黑色为主色，添加了彩色作为网页的一个亮点，导航高亮显示、banner图片鼠标划过，可以看到隐藏的文字。css3动画应用在banner和右边“我的名片”个人信息。重点在时间轴部分，三角形和圆形均是css代码写出来的，postion定位，增加页面返回到顶部的代码....</p>
				<a title="/" href="/" target="_blank" class="readmore">详细信息>></a>
			</ul>
			<div class="line"></div>
			<h2>Green绿色小清新的夏天-个人博客模板</h2>
			<p class="dateview">
				<span>发布时间：2013-11-04</span><span>作者：zsCat</span><span>分类：[<a
					href="/news/life/">个人博客模板</a>]
				</span>
			</p>
			<figure>
				<img src="images/03.jpg">
			</figure>
			<ul class="nlist">
				<p>这是一个有关Green绿色小清新的夏天的css3 html5绿色个人博客网站模板，导航下面的效果使用了CSS3
					Animation 实现对象从右到左渐变的动画效果。</p>
				<a title="/" href="/" target="_blank" class="readmore">详细信息>></a>
			</ul>
			<div class="line"></div>
			<h2>女生清新个人博客网站模板</h2>
			<p class="dateview">
				<span>发布时间：2013-11-04</span><span>作者：zsCat</span><span>分类：[<a
					href="/news/life/">个人博客模板</a>]
				</span>
			</p>
			<figure>
				<img src="images/04.jpg">
			</figure>
			<ul class="nlist">
				<p>这是一个html5+css个人博客模板，顶部导航用了css3的gradient背景颜色渐变效果，结合js，对当前栏目高亮显示并且skew水平倾斜的效果。左侧头像也用了css3鼠标放上去滑动出文字的效果...</p>
				<a title="/" href="/" target="_blank" class="readmore">详细信息>></a>
			</ul>
			<div class="line"></div>
			<div class="blank"></div>
			<div class="ad">
				<img src="images/ad.png">
			</div>
			<div class="page">
				<a title="Total record"><b>41</b></a><b>1</b><a
					href="/news/s/index_2.html">2</a><a href="/news/s/index_2.html">&gt;</a><a
					href="/news/s/index_2.html">&gt;&gt;</a>
			</div>
		</div>
		<aside class="right">
			<div class="rnav">
				<h2>栏目导航</h2>
				<ul>
					<li><a href="/download/" target="_blank">CSS3|Html5</a></li>
					<li><a href="/newsfree/" target="_blank">推荐工具</a></li>
					<li><a href="/newsfree/" target="_blank">心得笔记</a></li>
					<li><a href="/newsfree/" target="_blank">IP查询</a></li>
					<li><a href="/newsfree/" target="_blank">JS经典实例</a></li>
					<li><a href="/newsfree/" target="_blank">网站建设</a></li>
				</ul>
			</div>
			<div class="news">
				<h3>
					<p>
						最新<span>模板</span>
					</p>
				</h3>
				<ul class="rank">
					<li><a href="/" title="Column 三栏布局 个人网站模板" target="_blank">Column
							三栏布局 个人网站模板</a></li>
					<li><a href="/" title="with love for you 个人网站模板"
						target="_blank">with love for you 个人网站模板</a></li>
					<li><a href="/" title="免费收录网站搜索引擎登录口大全" target="_blank">免费收录网站搜索引擎登录口大全</a></li>
					<li><a href="/" title="做网站到底需要什么?" target="_blank">做网站到底需要什么?</a></li>
					<li><a href="/" title="企业做网站具体流程步骤" target="_blank">企业做网站具体流程步骤</a></li>
					<li><a href="/" title="建站流程篇――教你如何快速学会做网站" target="_blank">建站流程篇――教你如何快速学会做网站</a></li>
					<li><a href="/" title="box-shadow 阴影右下脚折边效果" target="_blank">box-shadow
							阴影右下脚折边效果</a></li>
					<li><a href="/" title="打雷时室内、户外应该需要注意什么" target="_blank">打雷时室内、户外应该需要注意什么</a></li>
				</ul>
				<h3 class="ph">
					<p>
						点击<span>排行</span>
					</p>
				</h3>
				<ul class="paih">
					<li><a href="/" title="Column 三栏布局 个人网站模板" target="_blank">Column
							三栏布局 个人网站模板</a></li>
					<li><a href="/" title="withlove for you 个人网站模板"
						target="_blank">with love for you 个人网站模板</a></li>
					<li><a href="/" title="免费收录网站搜索引擎登录口大全" target="_blank">免费收录网站搜索引擎登录口大全</a></li>
					<li><a href="/" title="做网站到底需要什么?" target="_blank">做网站到底需要什么?</a></li>
					<li><a href="/" title="企业做网站具体流程步骤" target="_blank">企业做网站具体流程步骤</a></li>
				</ul>
			</div>
			<div class="visitors">
				<h3>
					<p>最近访客</p>
				</h3>
				<ul>

				</ul>
			</div>
			<!-- Baidu Button BEGIN -->
			<div id="bdshare" class="bdshare_t bds_tools_32 get-codes-bdshare">
				<a class="bds_tsina"></a><a class="bds_qzone"></a><a class="bds_tqq"></a><a
					class="bds_renren"></a><span class="bds_more"></span><a
					class="shareCount"></a>
			</div>
			<script type="text/javascript" id="bdshare_js"
				data="type=tools&amp;uid=6574585"></script>
			<script type="text/javascript" id="bdshell_js"></script>
			<script type="text/javascript">
				document.getElementById("bdshell_js").src = "http://bdimg.share.baidu.com/static/js/shell_v2.js?cdnversion="
						+ Math.ceil(new Date() / 3600000)
			</script>
			<!-- Baidu Button END -->
		</aside>
	</article>
	<footer>
		<p>
			Design by DanceSmile <a href="http://www.mycodes.net/" title="源码之家"
				target="_blank">源码之家</a> <a href="/">网站统计</a>
		</p>
	</footer>
	<script src="js/silder.js"></script>
</body>
</html>